<!DOCTYPE html>
<!--
 * Copyright (c) 2009 The Chromium Authors. All rights reserved.  Use of this
 * source code is governed by a BSD-style license that can be found in the
 * LICENSE file.
-->
<html>
  <head>
    <title>Your Google Contacts List</title>
    <style type="text/css">
      body {
        font: 14px Arial;
      }
	  div {border:1px #000 solid;padding:10px;}
    </style>
  </head>
  <body>
    <h1>Your Google Contacts List</h1>
    <h2>Listing the first 100 results of a standard query to
      <a href="http://www.flickr.com/services/api/flickr.groups.getInfo.htm">flickr flickr.groups.getInfo API</a></h2>
    <button onclick="logout();">Click here to clear your OAuth token</button>
    <div id="output">
    </div>
    <script type="text/javascript">
      var contacts = chrome.extension.getBackgroundPage().contacts;
      var output = document.getElementById('output');
      for (var i = 0, contact; contact = contacts[i]; i++) {
        var div = document.createElement('div');
        var pName = document.createElement('h2');
        var pDesc = document.createElement('p');
		var pNum = document.createElement('p');

        pName.innerText = contact['name'];
        div.appendChild(pName);

        pDesc.innerText = contact['description'];
        div.appendChild(pDesc);

		pNum.innerText = contact['members'];
        div.appendChild(pNum);

        output.appendChild(div);
      }

      function logout() {
        chrome.extension.getBackgroundPage().logout();
        window.close();
      };
    </script>
  </body>
</html>
